<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<div th:replace="~{fragment/headFragment :: head}"></div>
<body class="cbp-spmenu-push">
<div class="main-content">
	<!--left-fixed -navigation-->
	<div th:replace="~{fragment/left-border :: left}"></div>

	<div th:replace="~{fragment/header :: header}"></div>

	<!-- //header-ends -->
	<!-- main content start-->
	<div id="page-wrapper">
		<div class="main-page">
			<div class="tables">
				<h3 class="title1" th:text="${fk}">Tables</h3>
				<div class="panel-body widget-shadow">
					<div class="search-box" style="margin: 0 0 2em 1em;">
						<form action="/visitorInfo/visitor" method="get" class="input">
							<input  class="sb-search-input input__field--madoka" placeholder="Search..." type="search" name="value" th:value="${#request.getParameter('value')}" id="input-31" />
							<label class="input__label" for="input-31">
								<input type="text" name="current" value="1" style="display: none">
								<input type="text" name="size" value="5" style="display: none">
								<svg class="graphic" width="100%" height="100%" viewBox="0 0 404 77" preserveAspectRatio="none">
									<path d="m0,0l404,0l0,77l-404,0l0,-77z"/>
								</svg>
							</label>
							<input type="submit" value="提交" style="display: none">
						</form>

					</div>
<!--					<h4 th:text="${fklb}">Basic Table:</h4>-->
					<table class="table">
						<thead>
						<tr>
							<th>序号</th>
							<th>ip地址</th>
							<th>访客姓名</th>
							<th>状态</th>
							<th>访问时间</th>
							<th>客服Id</th>
						</tr>
						</thead>
						<tbody>
						<tr th:each="cs,rowInfo : ${visitor_list}">
							<th>[[${rowInfo.count}]]</th>
							<td>[[${cs.ip}]]</td>
							<td>[[${cs.visitorname}]]</td>
							<td>[[${cs.state}]]</td>
							<td>[[${cs.visittime}]]</td>
							<td>[[${cs.customerserviceid}]]</td>
						</tr>
						</tbody>
					</table>
					<ul class="pagination pagination-lg">
						<!--                     th:class="${#request.getParameter('current')==i}"    -->
						<li><a th:href="@{/visitorInfo/visitor(current=${#request.getParameter('current')}-1,size=5,value=${#request.getParameter('value')})}" aria-label="Previous"><span aria-hidden="true">«</span></a></li>
						<li th:classappend="${(#request.getParameter('current') eq #strings.concat(i))?'active':''}" th:each="i:${#numbers.sequence(1,pagesCount)}"><a th:href="@{/visitorInfo/visitor(current=${i},size=5,value=${#request.getParameter('value')})}" th:text="${i}"></a></li>
						<li><a th:href="@{/visitorInfo/visitor(current=${#request.getParameter('current')}+1,size=5,value=${#request.getParameter('value')})}" aria-label="Next"><span aria-hidden="true">»</span></a></li>
					</ul>
				</div>
			</div>

		</div>
	</div>
	<!--footer-->
	<div class="footer">

	</div>
	<!--//footer-->
</div>
<!-- Classie -->
<script src="js/classie.js"></script>
<script>
	var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
			showLeftPush = document.getElementById( 'showLeftPush' ),
			body = document.body;

	showLeftPush.onclick = function() {
		classie.toggle( this, 'active' );
		classie.toggle( body, 'cbp-spmenu-push-toright' );
		classie.toggle( menuLeft, 'cbp-spmenu-open' );
		disableOther( 'showLeftPush' );
	};

	function disableOther( button ) {
		if( button !== 'showLeftPush' ) {
			classie.toggle( showLeftPush, 'disabled' );
		}
	}
</script>
<!--scrolling js-->
<script src="js/jquery.nicescroll.js"></script>
<script src="js/scripts.js"></script>
<!--//scrolling js-->
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.js"> </script>
</body>
</html>